import {useSelector} from "react-redux";
import {addTodo, updateTodo, deleteTodo, updateAllTodoDone, clearAllDone} from "./store/slice/todo";
import Footer from './Footer';
import Header from './Header';
import List from './List'
import '../../app.scss'


export default function AppRedux() {

    const {todos} = useSelector(state => state.todoList)

    return (
        <div className='todo-container'>
            <div className='todo-wrap'>
                <Header addTodo={addTodo}/>
                <List todos={todos} updateTodo={updateTodo} deleteTodo={deleteTodo}/>
                <Footer todos={todos} clearAllDone={clearAllDone} updateAllTodoDone={updateAllTodoDone}/>
            </div>
        </div>
    )
}

